<template>
    <div class="container">
      <div class="head_component">
        <TitleHead></TitleHead>
      </div>

      <div class="main">
        <router-view></router-view>
      </div>
      <div class="footer_component">
       <FooterList></FooterList>
      </div>

    </div>
</template>
<style>
.container{
  width:100%;
  height:100%;
  position:relative;
}
.head_component{
  width:100%;
  height:0.9rem;

}
.main{
  position:absolute;
  top:0.9rem;
  bottom:1rem;
  left:0;
  right:0;
}
.footer_component{
  position:absolute;
  height:1rem;
  left:0;
  bottom:0;
  width:100%;

}
</style>
<script >
    import TitleHead from './components/head'
    import FooterList from './components/footer'
    import HomeComponent from './container/home'
      export default {
        // name: 'app',
        data () {
            return {}
        },
        components:{
          TitleHead,
          FooterList,
          HomeComponent
        }
    }
</script>
